<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <div id='container'>
        <div class="content">
            <input type='button' value='点击抛出错误' onClick='errorClick()'></input>
            <input type='button' value='点击抛出Promise错误' onClick='promiseErrorClick()'></input>
            <input type='button' value='ajax成功请求' onClick='sendSuccess()'></input>
            <input type='button' value='ajax失败请求' onClick='sendError()'></input>
        </div>

    </div>
</body>
<script>
    function errorClick() {
        window.someVar.error = 'error'
    }

    function promiseErrorClick() {
        new Promise(function (resolve, reject) {
            window.someVar.error = 'error' //这样报错 event.reason是对象
            // reject('error') //这样报错 event.reason是字符串
        }).then(result => {
            console.log(result)
        })
    }

    function sendSuccess() {
        let xhr = new XMLHttpRequest
        xhr.open("GET", '/success', true);
        xhr.responseType = 'json'
        xhr.onload = function () {
            console.log(xhr.response, "response");
        };
        xhr.send()
    }
    //sendError
    function sendError() {
        let xhr = new XMLHttpRequest
        xhr.open("POST", '/error', true);
        xhr.responseType = 'json'
        xhr.onload = function (res) {
            console.log(res, "response");
        };
        xhr.send("name=zhufeng")
    }
</script>
<!-- 目的：出现加载失败 -->
<!-- <script src="someError.js"></script> -->

</html>